<template >
  <!-- 服务管理 -->
  <div class="innerPageTable-box-OneTwo value-set-list-wrap innerPageTable-out-flex">
    <!-- 搜索区域 -->
    <SelfAdaption>
      <Form
        :model="searchForm"
        ref="serviceForm"
        slot="adaption-bar"
        label-position="top"
        class="ivu-form-no-margin-bottom"
        inline
      >
        <Form-item prop="vsCode" :label="'标题：'">
          <Input
            type="text"
            v-model.trim="searchForm.wfTittle"
            :placeholder="'请输入'"
            @on-enter="searchValueSet"
          ></Input>
        </Form-item>
        <Form-item prop="vsCode" :label="'业务单元：'">
          <Select filterable clearable v-model="searchForm.trgNode">
            <Option v-for="item in bussinessUnit" :value="item" :key="item">{{
              item
            }}</Option>
          </Select>
        </Form-item>
        <Form-item prop="approverName" :label="'审批人：'">
          <Input
            type="text"
            v-model.trim="searchForm.approverName"
            :placeholder="'请输入'"
            @on-enter="searchValueSet"
          ></Input>
        </Form-item>
        <Form-item prop="operateStatus" :label="'审批结果：'">
          <Select filterable clearable v-model="searchForm.operateStatus">
            <Option v-for="item in operateStatusList" :value="item.value" :key="item.value">{{
              item.text
            }}</Option>
          </Select>
        </Form-item>
        <!-- 查询\重置按钮 -->
        <Form-item prop="button" class="search-solt-btn">
          <RPButton optType="search" ref='search' @click="searchValueSet()" />
        </Form-item>
      </Form>
    </SelfAdaption>
    <InnerPageTable ref="valueSetTable" :config="pageTableConfig" v-if='showTable'>
    </InnerPageTable>
  </div>
</template>

<script>
import { processedColumns, columnListProcessed } from './columns'
import todoApi from '../../../api/todoCender.js'
import coverApi from '@/api/cover.js'
import planEditAndDetail from '../../dataSummary/planEditAndDetail.vue'
import CoverRateEdit from '../../../components/ListView/CoverRateEdit.vue'
import CoverTargetEdit from '../../../components/ListView/CoverTargetEdit.vue'
import { approvalMix } from '@/views/todoCenter/myApproval/approval-mix'
import tableColumnSetting from '@/mixin/tableColumnSetting'
import {
  TABLE_TYPE_ID_PLAN,
  TABLE_TYPE_ID_STATUS,
  TABLE_TYPE_ID_TARGET,
  TABLE_TYPE_ID_RATE,
} from './const.js'
import {
  PROCESS_STATUS_WAIT_SUBMIT,
  PROCESS_STATUS_WAIT_APPROVE,
  PROCESS_STATUS_LIST,
} from '@/tools/common.js'
export default {
  name: 'processed',
  mixins: [approvalMix, tableColumnSetting],
  data() {
    return {
      bussinessUnit: [],
      operateStatusList: PROCESS_STATUS_LIST.filter(item => item.value != PROCESS_STATUS_WAIT_SUBMIT && item.value != PROCESS_STATUS_WAIT_APPROVE),
      searchForm: {
        wfTittle: '',
        taskCode: '',
        trgNode: '',
        approverName: '',
        operateStatus: '',
      },
      pageTableConfig: {
        loadDataFn: this.getServiceList.bind(this),
        columns: processedColumns.bind(this)(),
        autoFirst: false //默认 就是 false, 要配置在这里
      },
      menuNo: 'processed',
      columnList: columnListProcessed
    }
  },
  created() {
  },
  beforeMount: function () {},
  beforeDestroy: function () {},
  destroyed: function () {},
  methods: {
    init() {
      this.getBussinessUnit()
      this.searchValueSet()
    },
    getBussinessUnit() {
      coverApi.getMyApprovalBussinessUnit().then(res => {
        this.bussinessUnit = res.data.data || []
        this.searchValueSet()
      })
    },
    goDetail(row) {
      let viewList = [
        {
          tableTypeId: TABLE_TYPE_ID_PLAN,
          page: planEditAndDetail,
          type: 'plan',
          title: ''
        },
        {
          tableTypeId: TABLE_TYPE_ID_STATUS,
          page: CoverTargetEdit,
          type: 'status',
          title: '2022年数字化覆盖现状'
        },
        {
          tableTypeId: TABLE_TYPE_ID_TARGET,
          page: CoverTargetEdit,
          type: 'target',
          title: '“十四五”数字化覆盖目标'
        },
        {
          tableTypeId: TABLE_TYPE_ID_RATE,
          page: CoverRateEdit,
          type: 'rate',
          title: '数字化覆盖率计算表'
        }
      ]

      let obj = viewList.filter(item => item.tableTypeId == row.tableId)[0]
      if (obj) {
        new this.$sidelipPage(
            obj.page,
            {
              props: {
                disabledPage: true,
                id: row.id,
                fromPage: 'Approver',
                dataStatus: row.wfStatus || 3,
                type: obj.type,
                title: obj.title
              }
            },
            data => {
              data && this.searchInfo()
            }
        );
      }
    },
    getServiceList: tableObj => {
      let { responseProcess, param } = tableObj
      let { pageNum, pageSize, taskCode, wfTittle, trgNode, approverName, operateStatus } = param
      todoApi.getProcessedTableList({
        currentPage: pageNum,
        pageSize,
        wfTittle,
        taskCode,
        trgNode,
        approverName,
        operateStatus,
        sortOrderBy: 'DESC',
        sortPropName: 'approveDate'
      }).then(res => {
        let { current, size, records, pages, total  } = res.data.data
        responseProcess({
          pageNum: Number(current),
          size: Number(size),
          pages: pages,
          records: records || [],
          total: Number(total),
        });
      })
    },
    //搜索
    searchValueSet() {
      this.$refs['valueSetTable'].load(this.searchForm)
      this.$set(this.searchForm, 'taskCode', '')
    }
  },
  directives: {}
}
</script>
<style lang="less" scoped>
/deep/.table-bar button:last-child{
   color:#ffffff;
    background-color: #ff6f4b;
    border-color: #ff6f4b;
}
</style>
